
<div class="d-flex flex-column flex-md-row align-items-center p-3 px-md-4 mb-3 bg-white border-bottom shadow-sm">

  {{#if (eq data.themeSettings.logoType "text")}}
  <h5 class="my-0 mr-md-auto font-weight-normal">{{ data.themeSettings.logoTitle }}</h5>
  {{/if}}

  {{#if (eq data.themeSettings.logoType "image")}}
  <div style="{{ data.themeSettings.imageStyle}}" class="mr-md-auto">
    <img src="/assets/uploads/{{ data.themeSettings.fileName}}" alt=""
      width="{{ data.themeSettings.imageWidth}}">
  </div>
  {{/if}}

  <nav class="my-2 my-md-0 mr-md-3">

    <ul class="nav justify-content-end">
      {{#each data.menu}}
      <li class="nav-item {{#if this.isActive}}active{{/if}} {{#if this.showChildren}}dropdown{{/if}}">
        <a class="nav-link {{#if this.showChildren}}dropdown-toggle{{/if}}" href="{{this.data.url}}"
          {{#if this.showChildren}}data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" {{/if}}>
          {{this.data.title}}
          <span class="sr-only">(current)</span></a>

        {{#if this.showChildren}}
        <div class="dropdown-menu" aria-labelledby="navbarDropdown">
          {{#each this.children}}
          <a class="dropdown-item" href="{{this.data.url}}">{{this.data.title}}</a>
          {{/each}}
        </div>
        {{/if}}
      </li>
      {{/each}}
      </li>
    </ul>
    </ul>
  </nav>
  <a class="btn btn-outline-primary" href="/login">Login</a>&nbsp;
  <a class="btn btn-outline-primary" href="/register">Sign up</a>
</div>
